<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>My JSP 'MyJsp.jsp' starting page</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<style type="text/css">
.TrTitle {
	background: #D4D0C8;
	height: 20;
	border-bottom: 5px solid #D4D0C8;
	color: #000;
	cursor: hand;
}

.TrOver {
	background: #808080;
	height: 18;
	border: 0px solid #999999;
	color: #D4D0C8;
	cursor: hand;
}

.TdOver {
	background: #ffffff;
	height: 18;
	width: 22px;
	border: 0px solid #cccccc;
	color: #000;
	cursor: hand;
}

.TdOut {
	background: #C6D3EF;
	height: 16;
	width: 20px;
	border: 1px solid #3169C6;
	color: #333333;
	cursor: hand;
}

.TdOver2 {
	background: #e6e6e6;
	height: 18;
	border: 1px solid #cccccc;
	border-top: 1px solid #ffffff;
	border-left: 1px solid #ffffff;
	color: #666666;
	cursor: hand;
}

.TdOut2 {
	background: #e6e6e6;
	height: 18;
	border: 1px solid #ffffff;
	border-top: 1px solid #cccccc;
	border-left: 1px solid #cccccc;
	color: #000000;
	cursor: hand;
}
</style>
<script language="javascript" type="text/javascript">
document.writeln("<div id='DateGird' style='display:none;position: absolute;border:1px solid #404040;background-color:   #D4D0C8;'></div>");
var Glob_YY=parseInt(new Date().getFullYear());
var Glob_MM=parseInt(new Date().getMonth()+1);
var Glob_DD=parseInt(new Date().getDate());

function shotable(InputName)
{         
         var DateArray=["日","一","二","三","四","五","六"];
         var output=""
         output=output+"<div style='padding:5px;border-top:1px solid #f4f4f4;border-left:1px solid #f4f4f4;'><table style='width:156px;font-size:9pt;cursor:default;border:0px solid #999999;' border='0' cellpadding='0' cellspacing='0'>";
         output=output+"<tr ><td colspan='7' class='TrTitle'><span ID='yearUU'>"+Glob_YY+"</span><span ID='monthUU'>"+Glob_MM+"</span></td></tr><table>";
         output=output+"<table style='font-size:12px;font-family: "宋体", Helvetica, sans-serif;cursor:default;border:0px solid #999999;border-top:1px solid #404040;border-left:1px solid #404040;border-right:1px solid #efefef;border-bottom:1px solid #efefef;' border='1' cellpadding='0' cellspacing='0'>";
         output=output+"<tr align='center'>";
         for(var i=0;i<7;i++)        
         	 output=output+"<td class='TrOver'>"+DateArray[i]+"</td>";
         	output=output+"</tr>";
         for(var i=0;i<6;i++){
         output=output+"<tr align='center'>";
                 for(var j=0;j<7;j++)        
                 		 output=output+"<td id='TD' name='TD' class='TdOver' onmouseover='datelist.OverBK(this,''+InputName.name+'')' msg=''>&nbsp;</td>";
                         output=output+"</tr>";
                 } 
         output=output+"</tabe></div>";

   var selectMMInnerHTML = "<select ID='sMonth' onchange='setPan(document.getElementById('sYear').value,this.value)' style='width:50px;'>";
   for (var i = 1; i <   13; i++)
   {
     if (i == Glob_MM)
        {selectMMInnerHTML += "<option Author=wayx value='" + i + "' selected>" + i + "月" + "</option> ";}
     else {selectMMInnerHTML += "<option Author=wayx value='" + i + "'>" + i + "月" + "</option> ";}
   }
   selectMMInnerHTML += "</select>";
   var selectYYInnerHTML = "<select ID='sYear'   onchange='setPan(this.value,document.getElementById('sMonth').value)' style='width:65px;'>";
   for (var i = 1999; i <=   Glob_YY; i++)
   {
     if (i == Glob_YY)
        {selectYYInnerHTML += "<option Author=wayx value='" + i + "' selected>" + i + "年" + "</option> ";}
     else {selectYYInnerHTML += "<option Author=wayx value='" + i + "'>" + i + "年" + "</option> ";}
   }
   selectYYInnerHTML += "</select>";
         document.getElementById("DateGird").innerHTML= output;
         document.getElementById("monthUU").innerHTML= selectMMInnerHTML;
         document.getElementById("yearUU").innerHTML= selectYYInnerHTML;
         //document.writeln(output);
}
function classGetDate(sName)
{
this.obj=sName || "uncDate";
//alert(Date.parse(this.obj.value));
this.YY=Glob_YY;
this.MM=Glob_MM;
this.DD=Glob_DD;
document.getElementById("DateGird").style.display="";
setPan(this.YY,this.MM);
}        

function GetDay(y,m){
         this.TDate=function(){
                 this.DayArray=[];
                 for(var i=0;i<42;i++)this.DayArray[i]="&nbsp;";
                 for(var i=0;i<new Date(y,m,0).getDate();i++)this.DayArray[i+new Date(y,m-1,1).getDay()]=i+1;
                 return this.DayArray;
                 }
         return this;
         }

function setPan(YY,MM)
{
var DArray=GetDay(YY,MM).TDate();
var TDArr=document.getElementsByName("TD");
if (MM<10){var showMM="0"+MM;}else{var showMM=MM;}
for(var i=0;i<TDArr.length;i++){
         if (Glob_DD==DArray[i]&&YY==new Date().getFullYear()&&MM==new Date().getMonth()+1){TDArr[i].className="TdOut";}else{TDArr[i].className="TdOver"}
         TDArr[i].innerHTML=DArray[i]; 
         if (DArray[i]<10){var showDD="0"+DArray[i];}else{var showDD=DArray[i];}
         TDArr[i].msg=YY+"-"+showMM+"-"+showDD;
         }
}

datelist={
         dfd:function (sName)
         {
         var dateGirdObj=document.getElementById("DateGird");
         //var i= sName.style.top

         dateGirdObj.style.top=cmGetY(sName)+20;
         dateGirdObj.style.left=cmGetX(sName);
         shotable(sName);
         classGetDate(sName);
         },
         OverBK:function(t,m){
                
                 if(t.className!="TdOut"){
                        
                         t.onmouseout=function(){t.className="TdOver";}
                 }
                 if(t.innerHTML!="&nbsp;")t.className="TdOut";
                 t.onclick=function(){
                         if (t.innerHTML!="&nbsp;"){//alert(t.innerHTML);
                                 document.getElementById(m).value=t.msg;
                                 t.className="TdOver";
                                 document.getElementById("DateGird").style.display="none";
                         }
                 }
                
         }
}


function cmGetX (obj){var x = 0;do{x += obj.offsetLeft;obj = obj.offsetParent;}while(obj);return x;} 
function cmGetY (obj){var y = 0;do{y += obj.offsetTop;obj = obj.offsetParent;}while(obj);return y;}

</script>


</head>
<body>
	开始时间：
	<input name="number4" type="text" id="number4"
		onfocus="datelist.dfd(this)" readOnly> 结束时间：
	<input name="ddd3" type="text" id="ddd3" onfocus="datelist.dfd(this)"
		readOnly>

</body>
</html>
